<template>
  <div style="width: 100%;height: 100%;">
    <div
        style="width: 95%;height: 120%; position: relative;left: 50%;transform: translateX(-50%);padding:20px 80px 0px 80px;">
      <div style="margin-left: 75%">
        <el-button type="primary"  icon="el-icon-plus" @click="toXmkjsq()">申请项目空间</el-button>
        <el-button type="danger" icon="el-icon-delete" @click="newCxsqdialogVisible = true">项目撤销申请</el-button>
      </div>
      <el-tabs v-model="activeName">
        <el-tab-pane label="个人信息" name="mine">
          <div class="demo-image__preview" v-if="!showUpLoad">
            <el-image
                style="width: 200px; height: 200px"
                :src="avatarUrl"
                :preview-src-list="[avatarUrl]">
            </el-image>
          </div>
          <el-button type="success" @click="updateAvatar" v-if="!showUpLoad">更换头像</el-button>
          <el-upload v-if="showUpLoad"
                     class="avatar-uploader"
                     action="http://localhost:8089/qxglUser/uploadTX"
                     :show-file-list="false"
                     :on-remove="handleRemove"
                     :on-success="handleAvatarSuccess"
                     :data="{'userCode':userDetail.userCode}"
                     :before-upload="beforeAvatarUpload"
                     style="display: inline-block;width: 300px"
          >
            <img v-if="imageUrl" :src="imageUrl" class="avatar">
            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          </el-upload>

          <el-descriptions :border="true">
            <el-descriptions-item label="学号/职工号">
              <el-input v-model="userDetail.userCode"></el-input>
            </el-descriptions-item>
            <el-descriptions-item label="用户名">
              <el-input v-model="userDetail.userMc"></el-input>
            </el-descriptions-item>
            <el-descriptions-item label="班级">
              <el-input v-model="userDetail.userBj"></el-input>
            </el-descriptions-item>
            <el-descriptions-item label="手机号">
              <el-input v-model="userDetail.userSjh"></el-input>
            </el-descriptions-item>
            <el-descriptions-item label="邮箱">
              <el-input v-model="userDetail.userYx"></el-input>
            </el-descriptions-item>
            <el-descriptions-item label="所属部门">
              <el-select ref="newUserBm" v-model="userDetail.userBm" placeholder="请选择部门">
                <el-option v-for="item in bm" :key="item.keyname" :label="item.keyname" :value="item.keyvalue">
                </el-option>
              </el-select>
            </el-descriptions-item>
            <el-descriptions-item label="学院">
              <el-select v-model="userDetail.userXy" placeholder="请选择学院">
                <el-option v-for="item in xy" :key="item.keyname" :label="item.keyname" :value="item.keyvalue">
                </el-option>
              </el-select>
            </el-descriptions-item>
            <el-descriptions-item label="角色名称">
              <el-tag size="medium" effect="dark">{{ userDetail.roleMc }}</el-tag>
            </el-descriptions-item>
          </el-descriptions>
          <br/>
          <el-button type="primary" @click="saveMyxx()">保存个人信息</el-button>
          <el-button type="info" @click="toUserDetail()">重置个人信息修改</el-button>
        </el-tab-pane>
        <el-tab-pane label="项目基本信息" name="jbxx">
          <el-descriptions :border="true" v-if="userDetail.xmBh !== null">
            <el-descriptions-item label="项目编号">{{ xmDetail.xmBh }}</el-descriptions-item>
            <el-descriptions-item label="项目名称">{{ xmDetail.xmMc }}</el-descriptions-item>
            <el-descriptions-item label="项目空间">{{ xmDetail.xmKjhm }}</el-descriptions-item>
            <el-descriptions-item label="项目所属学院">{{ xmDetail.xmSsxy }}</el-descriptions-item>
            <el-descriptions-item label="项目状态">
              <el-tag size="small" effect="dark" v-if="xmDetail.xmzt === '0'">已申请</el-tag>
              <el-tag size="small" effect="dark" type="info" v-if="xmDetail.xmzt === '1'">通过初筛</el-tag>
              <el-tag size="small" effect="dark" type="danger" v-if="xmDetail.xmzt === '2'">未过初筛</el-tag>
              <el-tag size="small" effect="dark" type="warning" v-if="xmDetail.xmzt === '3'">合格</el-tag>
              <el-tag size="small" effect="dark" type="danger" v-if="xmDetail.xmzt === '4'">不合格</el-tag>
              <el-tag size="small" effect="dark" type="success" v-if="xmDetail.xmzt === '5'">入驻</el-tag>
              <el-tag size="small" effect="dark" style="background-color: #333333" v-if="xmDetail.xmzt === '-1'">退驻
              </el-tag>
            </el-descriptions-item>
            <el-descriptions-item label="填报人">{{ xmDetail.xmTbrmc }}</el-descriptions-item>
            <el-descriptions-item label="填报时间">{{ xmDetail.xmTbsj }}</el-descriptions-item>
            <el-descriptions-item label="项目类型">
              <el-tag size="small" effect="dark" v-if="xmDetail.xmXmlxbh === '00'">现代农业</el-tag>
              <el-tag size="small" effect="dark" type="info" v-if="xmDetail.xmXmlxbh === '01'">制造业</el-tag>
              <el-tag size="small" effect="dark" type="success" v-if="xmDetail.xmXmlxbh === '02'">信息技术服务</el-tag>
              <el-tag size="small" effect="dark" type="warning" v-if="xmDetail.xmXmlxbh === '03'">文化创意服务</el-tag>
              <el-tag size="small" effect="dark" type="danger" v-if="xmDetail.xmXmlxbh === '04'">社会服务</el-tag>
            </el-descriptions-item>
            <el-descriptions-item label="项目空间">{{ xmDetail.xmKjhm }}</el-descriptions-item>
            <br/>
            <el-descriptions-item v-if="xmDetail.xmzt == 2 || xmDetail.xmzt == 4" span="3" label="驳回理由"><span
                style="color: red;">{{ xmDetail.xmBhly }}</span></el-descriptions-item>
            <br/>
            <el-descriptions-item span="3" label="项目简介">
              <el-input type="textarea" v-model="xmDetail.xmJj" :rows="4" style="width: 1400px"></el-input>
            </el-descriptions-item>
            <br/>
            <el-descriptions-item span="3" label="项目创新点">
              <el-input type="textarea" v-model="xmDetail.xmcxd" :rows="4" style="width: 1400px"></el-input>
            </el-descriptions-item>
            <br/>
            <el-descriptions-item span="3" label="项目背景">
              <el-input type="textarea" v-model="xmDetail.xmBj" :rows="4" style="width: 1400px"></el-input>
            </el-descriptions-item>
            <br/>
            <el-descriptions-item span="3" label="项目意义">
              <el-input type="textarea" v-model="xmDetail.xmYy" :rows="4" style="width:1400px"></el-input>
            </el-descriptions-item>
            <br/>
            <el-descriptions-item span="3" label="市场需求分析">
              <el-input type="textarea" v-model="xmDetail.xmScxqfx" :rows="4" style="width: 1400px"></el-input>
            </el-descriptions-item>
            <br/>
            <el-descriptions-item span="3" label="项目关键技术介绍">
              <el-input type="textarea" v-model="xmDetail.xmGjjsjs" :rows="4" style="width: 1400px"></el-input>
            </el-descriptions-item>
            <br/>
          </el-descriptions>
          <div v-if="saveButton">
            <el-button type="primary" @click="saveXmxx()">保存项目基本信息</el-button>
            <el-button type="info" @click="toXmDetail()">重置项目基本信息修改</el-button>
          </div>

          <div v-if="userDetail.xmBh == null">暂无项目信息</div>
          <div v-if="userDetail.xmBh == null">
            <el-button type="primary" size="small" @click="toXmShengBao">项目申报</el-button>
          </div>

        </el-tab-pane>
        <el-tab-pane label="项目成员" name="xmcy">
          <div style="padding-right: 75rem;padding-bottom: 1rem">
            <el-button type="success" @click="dialogVisible = true">填加项目成员</el-button>
          </div>
          <el-table stripe :border="true"
                    :data="xmcys"
                    style="width: 75%;margin-bottom: 15px;position: relative;left: 50%;transform: translateX(-50%);">
            <el-table-column prop="cyXh" label="学号" width="130px" header-align="center" align="center">
            </el-table-column>
            <el-table-column prop="cyMc" label="姓名" width="110px" header-align="center" align="center">
            </el-table-column>
            <el-table-column prop="cySjh" label="手机号" width="150px" header-align="center" align="center">
            </el-table-column>
            <el-table-column prop="cyXy" label="所属学院" width="150px" header-align="center" align="center">
            </el-table-column>
            <el-table-column prop="cyBj" label="班级" width="140px" header-align="center" align="center">
            </el-table-column>
            <el-table-column prop="cyJs" label="介绍" width="300px" header-align="center" align="center">
            </el-table-column>
            <el-table-column align="center" fixed="right" label="操作" width="150px">
              <template slot-scope="scope">
                <el-button  size="mini" type="text" @click="toupdateXmcy(scope.$index, scope.row)">修改</el-button>
                <el-popconfirm  style="margin-left: 10px;" title="确定移除该成员吗？"
                               @confirm="deleteRow(scope.$index, xmcys)">
                  <el-button slot="reference" size="mini" type="text">移除</el-button>
                </el-popconfirm>
              </template>
            </el-table-column>
          </el-table>
          <el-button type="primary" @click="saveXmxx()">保存项目成员信息</el-button>
          <el-button type="info" @click="toXmDetail()">重置项目成员信息</el-button>
        </el-tab-pane>
        <el-tab-pane label="计划书" name="jhs">
          <div style="padding:2rem 0rem 2rem 0;position: relative;left:50%; transform: translateX(-50%);width:400px;display: flex;justify-content: space-around">
            <el-upload
                ref="upload"
                action="http://localhost:8089/cxcyXm/fileUpload"
                :data="{'xmBh':xmbh}"
                :on-remove="handleRemove"
                :on-success="uploadSuccess"
                :limit="1"
                :show-file-list="false">
              <el-button type="primary">上传计划书(Word)</el-button>
            </el-upload>
            <el-button @click="downloadTemplate()">下载计划书(Word)模板</el-button>
          </div>

          <el-table stripe :border="true" v-if="xmDetail.xmJhsdz !== ''"
                    :data="[{xmBh:xmbh,xmJhsdz:xmDetail.xmJhsdz}]"
                    style="width: 90%;margin-bottom: 15px;position: relative;left: 50%;transform: translateX(-50%);">
            <el-table-column prop="xmJhsdz" label="文件名"  header-align="center" align="center">
            </el-table-column>
            <el-table-column align="center" fixed="right" label="操作">
              <template slot-scope="scope">
                <el-button @click="downloadJhs(scope.row.xmJhsdz)" type="primary" size="mini">下载计划书
                </el-button>
              </template>
            </el-table-column>
          </el-table>

        </el-tab-pane>
        <el-tab-pane label="获奖情况" name="hjqk">
          <el-table stripe :border="true"
                    :data="xmhjqk"
                    style="width: 90%;margin-bottom: 15px;position: relative;left: 50%;transform: translateX(-50%);">
            <el-table-column prop="xmMc" label="项目名称" width="300px" header-align="center" align="center">
            </el-table-column>
            <el-table-column prop="bsMc" label="比赛名称" width="300px" header-align="center" align="center">
            </el-table-column>
            <el-table-column prop="bsJbmc" label="比赛级别" width="140px" header-align="center" align="center">
            </el-table-column>
            <el-table-column prop="djmc" label="获奖等级" width="140px" header-align="center" align="center">
            </el-table-column>
            <el-table-column prop="status" label="当前状态" width="140px" header-align="center" align="center">
              <template #default="scope">
                <el-tag effect="dark" type="warning" v-if="scope.row.status === '0'">未提交</el-tag>
                <el-tag effect="dark" type="primary" v-if="scope.row.status === '1'">已提交</el-tag>
                <el-tag effect="dark" type="success" v-if="scope.row.status === '2'">已审批</el-tag>
                <el-tag effect="dark" type="danger" v-if="scope.row.status === '-1'">已驳回</el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="hjzm" label="获奖证明" width="140px" header-align="center" align="center">
              <template #default="scope">
                <el-image
                    style="width: 100px; height: 100px"
                    :src="require('../assets/hjzm/'+scope.row.hjzm)"
                    :preview-src-list="[require('../assets/hjzm/'+scope.row.hjzm)]">
                </el-image>
                <el-button @click="toupHjzm(scope.row.id)" type="text" size="small">上传图片
                </el-button>
              </template>
            </el-table-column>
            <el-table-column  align="center" fixed="right" label="操作" width="200px">
              <template slot-scope="scope">
                <el-button  v-if="scope.row.status === '0'" size="mini" type="primary" @click="tjHjqk(scope.row.id,scope.row.hjzm)">提交</el-button>
              </template>
            </el-table-column>
          </el-table>
          <el-button type="success" @click="toUpHjqk()">上传比赛获奖记录</el-button>
        </el-tab-pane>
      </el-tabs>


    </div>
    <!-- 添加项目团队成员弹窗 -->
    <el-dialog title="添加项目团队成员" :visible.sync="dialogVisible" width="30%" :modal-append-to-body="false">
      <span>
        <el-form
            :model="xmcyForm"
            stripe
            ref="xmcyForm"
            label-width="100px"
            :rules="xmcyFormRules">
        <el-form-item prop="cyXh" label="学号">
          <el-input v-model="xmcyForm.cyXh" style="width: 20rem"></el-input>
        </el-form-item>
        <el-form-item prop="cyMc" label="姓名">
          <el-input v-model="xmcyForm.cyMc" style="width: 20rem"></el-input>
        </el-form-item>
        <el-form-item prop="cySjh" label="手机号码">
          <el-input v-model="xmcyForm.cySjh" style="width: 20rem"></el-input>
        </el-form-item>
        <el-form-item prop="cyXy" label="学院">
          <el-select v-model="xmcyForm.cyXy" placeholder="请选择学院">
            <el-option v-for="item in xy" :key="item.keyname" :label="item.keyname" :value="item.keyname">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item prop="cyBj" label="班级">
          <el-input v-model="xmcyForm.cyBj" style="width: 20rem"></el-input>
        </el-form-item>
           <el-form-item prop="cyJs" label="成员介绍">
          <el-input type="textarea" :rows="3" v-model="xmcyForm.cyJs" style="width: 20rem"></el-input>
        </el-form-item>
        </el-form>
      </span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="xmcyFormSubmit('xmcyForm')">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 修改项目团队成员弹窗 -->
    <el-dialog title="修改项目团队成员信息" :visible.sync="upXmcyVisible" width="30%" :modal-append-to-body="false">
      <span>
        <el-form
            :model="upXmcy"
            stripe
            ref="upXmcy"
            label-width="100px"
            :rules="xmcyFormRules">
        <el-form-item prop="cyXh" label="学号">
          <el-input v-model="upXmcy.cyXh" style="width: 20rem"></el-input>
        </el-form-item>
        <el-form-item prop="cyMc" label="姓名">
          <el-input v-model="upXmcy.cyMc" style="width: 20rem"></el-input>
        </el-form-item>
        <el-form-item prop="cySjh" label="手机号码">
          <el-input v-model="upXmcy.cySjh" style="width: 20rem"></el-input>
        </el-form-item>
        <el-form-item prop="cyXy" label="学院">
          <el-select v-model="upXmcy.cyXy" placeholder="请选择学院">
            <el-option v-for="item in xy" :key="item.keyname" :label="item.keyname" :value="item.keyname">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item prop="cyBj" label="班级">
          <el-input v-model="upXmcy.cyBj" style="width: 20rem"></el-input>
        </el-form-item>
           <el-form-item prop="cyJs" label="成员介绍">
          <el-input type="textarea" :rows="3" v-model="upXmcy.cyJs" style="width: 20rem"></el-input>
        </el-form-item>
        </el-form>
      </span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="upXmcyVisible = false">取 消</el-button>
        <el-button type="primary" @click="upxmcyFormSubmit('upXmcy')">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog  title="项目撤销申请" :visible.sync="newCxsqdialogVisible" width="30%">
      <el-form :model="newCxsq">
        <el-form-item label="项目名称" label-width="100px">
          <el-input v-model="newCxsq.xmMc" autocomplete="off" disabled></el-input>
        </el-form-item>
        <el-form-item label="当前状态" label-width="100px" v-if="newCxsq.cxsqZt">
          <el-tag effect="dark" type="primary" v-if="newCxsq.cxsqZt === '0'">未审批</el-tag>
          <el-tag effect="dark" type="success" v-if="newCxsq.cxsqZt === '1'">已审批</el-tag>
          <el-tag effect="dark" type="danger" v-if="newCxsq.cxsqZt === '2'">驳回</el-tag>
        </el-form-item>
        <el-form-item label="撤销原因" label-width="100px">
          <el-input :disabled="newCxsq.cxsqZt === '1' || newCxsq.cxsqZt === '2'" v-model="newCxsq.cxsqYy" autocomplete="off" type="textarea" :rows="3"></el-input>
        </el-form-item>
        <el-form-item label="准备退出日期" label-width="100px">
          <el-date-picker :disabled="newCxsq.cxsqZt === '1' || newCxsq.cxsqZt === '2'" v-model="newCxsq.cxsqTcrq" autocomplete="off" type="date"></el-date-picker>
        </el-form-item>
        <el-form-item label="驳回原因" label-width="100px" v-if="newCxsq.cxsqZt === '2'">
          <el-input  v-model="newCxsq.bhly" autocomplete="off" type="textarea" :rows="3"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="newCxsqdialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="addXmcxsq()">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog title="项目空间申请" :visible.sync="dialogVisible1" width="50%">
      <el-form :model="xmkjsq">
        <el-form-item label="项目名称" label-width="100px">
          <el-input v-model="xmkjsq.xmMc" autocomplete="off" disabled></el-input>
        </el-form-item>
        <el-form-item label="申请理由" label-width="100px">
          <el-input :disabled="xmkjsq.status !== '0' && xmkjsq.status" v-model="xmkjsq.sqly" autocomplete="off" type="textarea" :rows="3"></el-input>
        </el-form-item>
        <el-form-item label="当前状态" label-width="100px" v-if=" xmkjsq.status">
          <el-tag effect="dark" type="primary" v-if="xmkjsq.status === '0'">未审批</el-tag>
          <el-tag effect="dark" type="success" v-if="xmkjsq.status === '1'">已审批</el-tag>
          <el-tag effect="dark" type="danger" v-if="xmkjsq.status === '-1'">已驳回</el-tag>
        </el-form-item>
      </el-form>
      <span style="color: red;">提交项目空间申请后，请至校内创新创业孵化基地，办理相关入驻手续。</span>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible1 = false">取 消</el-button>
        <el-button type="primary" @click="saveXmkjsq()" v-if="xmkjsq.status !== '1'">确 定</el-button>
        <el-button type="primary" @click="dialogVisible1 = false" v-else-if="xmkjsq.status === '1'">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog title="上传比赛获奖记录" :visible.sync="newHjqkDialogVisible" width="30%">
      <el-form :model="newXmhjqk">
        <el-form-item label="项目名称" label-width="100px">
          <el-input v-model="newXmhjqk.xmMc" autocomplete="off" disabled></el-input>
        </el-form-item>
        <el-form-item label="比赛名称" label-width="100px">
          <el-input v-model="newXmhjqk.bsMc" autocomplete="off"></el-input>
        </el-form-item>
        <el-select v-model="newXmhjqk.bsJb" placeholder="请选择比赛级别">
          <el-option
              v-for="item in bsjb"
              :key="item.keyvalue"
              :label="item.keyname"
              :value="item.keyvalue">
          </el-option>
        </el-select>
        <br/><br/><br/>
        <el-select v-model="newXmhjqk.dj" placeholder="请选择项目获奖等级">
          <el-option
              v-for="item in hjdj"
              :key="item.keyvalue"
              :label="item.keyname"
              :value="item.keyvalue">
          </el-option>
        </el-select>
        <br/><br/><br/>
        <el-form-item label="证书获取日期" label-width="100px">
          <el-date-picker  v-model="newXmhjqk.hjsj" autocomplete="off" type="date"></el-date-picker>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="newHjqkDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="saveXmhjqkFun()">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog title="上传项目获奖证明照片" :visible.sync="uphjzmVisible" width="30%">
      <el-upload class="avatar-uploader"
                 action="http://localhost:8089/xmHjqk/uploadHjzm"
                 :show-file-list="false"
                 :on-remove="handleRemove"
                 :on-success="handleAvatarSuccessUP"
                 :data="{'id':hkqkid}"
                 :before-upload="beforeAvatarUpload"
                 style="display: inline-block;width: 300px"
      >
        <i class="el-icon-plus avatar-uploader-icon"></i>
      </el-upload>
    </el-dialog>

  </div>
</template>

<script>
import axios from "../axios/axios.js";
import {selectRole} from "@/api/role";
import {updateUser} from "@/api/user"
import {saveXmCxsq, saveXmkjsq, queryXmkjKx, saveXmhjqk} from "@/api/cxcyxm";
import {cxcyxmShenBao} from "@/api/cxcyxm"
import exportWordAndImage from "@/components/downLoadWord";

export default {
  data() {
    return {
      updateRowIndex:0,
      upXmcyVisible:false,
      newHjqkDialogVisible:false,
      token: localStorage.getItem('token'),
      showUpLoad: false,
      userBh: "",
      xmbh: "",
      xmDetail: {},
      xmcys: [],
      activeName: 'mine',
      xmhjqk: [],
      bm: [],
      xy: [],
      userDetail: {},
      avatarUrl: "",
      imageUrl: "",
      xmcyForm: {
        roleBh: "",
        roleMc: "",
        cyXh: "",
        cyMc: "",
        cySjh: "",
        cyXy: "",
        cyBj: "",
        cyJs: "",
        index: 0
      },
      upXmcy:{},
      xmcysisNoll: true,
      xmcyFormRules: {
        cyXh: [{required: true, message: '请输入12位数字的学号', trigger: 'blur'},
          {validator: this.validateNumber, trigger: 'blur'}],
        cyMc: [{required: true, message: '请输入姓名', trigger: 'blur'}],
        cySjh: [{required: true, message: '请输入正确手机号', trigger: 'blur'},
          {min: 11, max: 11, message: '手机号为11位', trigger: 'blur'}],
        cyXy: [{required: true, message: '请输入学院', trigger: 'blur'}],
        cyBj: [{required: true, message: '请输入班级', trigger: 'blur'}]
      },
      newCxsqdialogVisible: false,
      dialogVisible: false,
      newCxsq: {
        cxsqBh: "",
        xmBh: localStorage.getItem("xmBh"),
        xmMc: localStorage.getItem("xmMc"),
        cxsqYy: "",
        cxsqTcrq: "",
      },
      xmkjsq: {
        xmBh: localStorage.getItem("xmBh"),
        xmMc: localStorage.getItem("xmMc"),
        sqly: ""
      },
      dialogVisible1: false,
      saveButton: false,
      bsjb:[],
      hjdj:[],
      newXmhjqk:{},
      uphjzmVisible:false,
      hkqkid:""
    }
  },
  created() {
    this.xmbh = localStorage.getItem("xmBh")
    this.userBh = localStorage.getItem("userBh")
    if (this.xmbh != null && this.xmbh != "null" && this.xmbh != '') {
      this.saveButton = true
      this.toXmDetail();
      this.queryXmcxsq(this.xmbh)
    }

    this.toUserDetail()
    this.queryKey("xy,bm,bsjb,hjdj")
  },
  methods: {
    queryKey(keyCodes) {
      axios({
        method: 'GET',
        url: '/keyValue/queryKey?keyCodes=' + keyCodes
      }).then(res => {
        if (res.code == "200") {
          this.xy = res.data.xy
          this.bm = res.data.bm
          this.bsjb = res.data.bsjb
          this.hjdj = res.data.hjdj
        }
      })
    },
    toXmDetail() {
      axios({
        method: 'GET',
        url: '/cxcyXm/queryCxcyXmByBh/' + this.xmbh
      }).then(res => {
        if (res.code === "200") {
          this.xmDetail = res.data.xmDetail
          this.xmcys = res.data.xmcyList
          this.xmcyForm.index = this.xmcys.length
          if (this.xmcyForm.index !== 0){
            this.xmcysisNoll = false
          }
          this.xmhjqk = res.data.xmHjqkList
        } else {
          this.$message.error(res.msg)
        }

      })
    },
    toUserDetail() {
      axios({
        method: 'GET',
        url: '/qxglUser/getUserDetail/' + this.userBh
      }).then(res => {
        if (res.code === "200") {
          this.userDetail = res.data
          this.avatarUrl = require("../assets/avatar/" + res.data.avatarUrl)
        } else {
          this.$message.error(res.msg)
        }

      })
    },
    toXmShengBao() {
      this.$router.push({path: 'cxcyxmSb'})
    },
    addXmcxsq() {
      saveXmCxsq(this.newCxsq).then(res => {
        if (res.code === "200") {
          this.$message.success(res.msg)
          this.newCxsqdialogVisible = false
        } else {
          this.$message.error(res.msg)
        }
      })
    },
    queryXmcxsq(xmBh) {
      axios({
        method: 'POST',
        url: '/xmCxsq/getXmCxsqDetail/' + xmBh
      }).then(res => {
        if (res.code == '200') {
          this.newCxsq = res.data
        }
      })
    },
    toXmkjsq() {
      queryXmkjKx().then(res => {
        if (res.code == '200') {
          axios({
            method: 'POST',
            url: '/xmkjSq/getXmKjsqDetailByXmbh/' + this.xmbh
          }).then(res => {
            if (res.code == "200") {
              this.xmkjsq = res.data
            }
            this.dialogVisible1 = true
          })
        } else {
          this.$message.warning(res.msg)
        }

      })

    },
    saveXmkjsq() {
      saveXmkjsq(this.xmkjsq).then(res => {
        if (res.code === "200") {
          this.$message.success(res.msg)
          this.dialogVisible1 = false
        } else {
          this.$message.error(res.msg)
        }
      })
    },
    saveMyxx() {
      updateUser(this.userDetail).then(res => {
        if (res.code == '200') {
          this.$message.success(res.msg);
          this.toUserDetail()
        } else {
          this.$message.warning(res.msg)
        }
      })
    },
    saveXmxx() {
      this.xmDetail.czbz = "save"
      this.xmDetail.xmCyList = this.xmcys
      cxcyxmShenBao(this.xmDetail).then(res => {
        if (res.code == '200') {
          this.$message.success(res.msg)
        }
      })
    },
    // 添加项目成员至项目成员表格
    xmcyFormSubmit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.$set(this.xmcys, this.xmcyForm.index,
              {
                cyXh: this.xmcyForm.cyXh,
                cyMc: this.xmcyForm.cyMc,
                cySjh: this.xmcyForm.cySjh,
                cyXy: this.xmcyForm.cyXy,
                cyBj: this.xmcyForm.cyBj,
                cyJs: this.xmcyForm.cyJs,
              })

          this.xmcyForm.index++

          this.xmcyForm.cyXh = ''
          this.xmcyForm.cyMc = ''
          this.xmcyForm.cySjh = ''
          this.xmcyForm.cyXy = ''
          this.xmcyForm.cyBj = ''
          this.xmcyForm.cyJs = ''

          this.dialogVisible = false;
          this.xmcysisNoll = false
        } else {
          return false;
        }
      });

    },
    validateNumber(rule, value, callback) {
      if (!/^\d{12}$/.test(value)) {
        callback(new Error('请输入12位数字'))
      } else {
        callback()
      }
    },
    toupdateXmcy(index, row){
      this.updateRowIndex = index
      this.upXmcy = {...row}
      this.upXmcyVisible = true;

    },
    upxmcyFormSubmit(formName){
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.$set(this.xmcys, this.updateRowIndex,
              {
                cyXh: this.upXmcy.cyXh,
                cyMc: this.upXmcy.cyMc,
                cySjh: this.upXmcy.cySjh,
                cyXy: this.upXmcy.cyXy,
                cyBj: this.upXmcy.cyBj,
                cyJs: this.upXmcy.cyJs,
              })
          this.upXmcyVisible = false;
        } else {
          return false;
        }
      });
    },
    deleteRow(index, rows) {
      rows.splice(index, 1)
    },
    handleAvatarSuccess(res, file) {
      this.imageUrl = URL.createObjectURL(file.raw);
      window.location.reload();
      localStorage.setItem("avatarUrl",res)
    },
    beforeAvatarUpload(file) {
      const isJPG = file.type === 'image/jpeg';
      const isLt2M = file.size / 1024 / 1024 < 2;

      if (!isJPG) {
        this.$message.error('上传头像图片只能是 JPG 格式!');
      }
      if (!isLt2M) {
        this.$message.error('上传头像图片大小不能超过 2MB!');
      }
      return isJPG && isLt2M;
    },
    uploadSuccess() {
      axios({
        method: 'GET',
        url: '/cxcyXm/queryCxcyXmByBh/' + this.xmbh
      }).then(res => {
        if (res.code === "200") {
          this.xmDetail = res.data.xmDetail
          this.xmcys = res.data.xmcyList
          this.xmcyForm.index = this.xmcys.length
          if (this.xmcyForm.index !== 0){
            this.xmcysisNoll = false
          }
          this.xmhjqk = res.data.xmHjqkList
          if (res.data.xmDetail.xmJhsdz == "" || res.data.xmDetail.xmJhsdz == null) {
            this.$message.warning("计划书上传失败，请检查计划书是否被其他应用占用！")
          }else {
            this.$message.success("计划书上传成功")
          }
        } else {
          this.$message.error(res.msg)
        }

      })

      this.$router.go(0)

    },
    handleRemove(file) {
      var path = file.response.data
      var fileFlag = path.split("/")[path.split("/").length - 1]
      axios({
        method: "GET",
        url: "/cxcyXm/removeFiles/" + fileFlag
      }).then(res => {
        if (res.code == "200") {
          this.$refs['upload'].clearFiles()
          this.newXm.xmJhsdz = ''
        }
      })
    },
    updateAvatar() {
      this.showUpLoad = true
    },
    downloadTemplate(){
      exportWordAndImage("Template.docx");
    },
    downloadJhs(jhsdz){
      exportWordAndImage(jhsdz);
    },
    toUpHjqk(){
      this.newHjqkDialogVisible = true
      this.newXmhjqk.xmBh = this.xmbh
      this.newXmhjqk.xmMc = this.xmDetail.xmMc
    },
    toupHjzm(id){
      this.uphjzmVisible = true
      this.hkqkid = id
    },
    handleAvatarSuccessUP(res, file) {
      this.$message.success("图片上传成功")
      this.uphjzmVisible = false
      this.toXmDetail()
      this.$router.go(0)
    },
    saveXmhjqkFun(){
      saveXmhjqk(this.newXmhjqk).then(res=>{
        if (res.code == "200"){
          this.newHjqkDialogVisible = false
          this.$message.success("项目获奖情况保存成功！")
          this.toXmDetail()
          this.$router.go(0)
        }
      })
    },
    tjHjqk(id,hjzm){
      if (hjzm == "img.png") {
        this.$message.warning("请先上传获奖证明！")
      }else {
        axios({
          method: 'GET',
          url: '/xmHjqk/tjXmhjqk/' + id
        }).then(res => {
          if (res.code == "200") {
            this.newHjqkDialogVisible = false
            this.$message.success("项目获奖情况提交成功！")
            this.toXmDetail()
            this.$router.go(0)
          }
        })
      }
    }
  }

}
</script>
<style>
.xmdetail {
  padding: 40px 80px 0px 80px;
}

.dhText {
  overflow: hidden; /* 超出部分隐藏 */
  display: -webkit-box; /* 使用弹性盒子布局 */
  -webkit-line-clamp: 3; /* 行数限制为3 */
  -webkit-box-orient: vertical; /* 垂直排列 */
}

.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}

.avatar-uploader .el-upload:hover {
  border-color: #409EFF;
}

.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}

.avatar {
  width: 178px;
  height: 178px;
  display: block;
}
</style>
